/**
 * 密码修改
 * 
 * @author Gill Gong
 */

 import React from "react"
 import { SafeAreaView, StyleSheet, View, Text, TextInput, Button } from "react-native"

 class PasswordModify extends React.Component {

  static navigationOptions = ({ navigation })=>{

    return {
      title: "密码修改"
    }
  }

  constructor(options) {
    super(options)

    this.state = {
      oringalPassword: '',
      confirmPassword: '',
      newPassword: ''
    }
  }

  render() {

    return (
      <SafeAreaView>    
        <View style={ styles.inputRow }>
          <Text style={{ fontSize: 18, marginTop: 40 }}>原密码</Text>
          <TextInput
            style={[ styles.inputText ]} value={ this.state.oringalPassword }
            onChangeText={ text => this.onOringalPasswordChange(text) }>
          </TextInput>   
        </View>
        <View style={ styles.inputRow }>
          <Text style={{ fontSize: 18 }}>新密码</Text>
          <TextInput
            style={[ styles.inputText ]} value={ this.state.newPassword }
            onChangeText={ text => this.onNewPasswordChange(text) }>
          </TextInput>   
        </View>
        <View style={ styles.inputRow }>
          <Text style={{ fontSize: 18 }}>确认密码</Text>
          <TextInput
            style={[ styles.inputText ]} value={ this.state.confirmPassword }
            onChangeText={ text => this.onConfirmPasswordChange(text) }>
          </TextInput>   
        </View>
        <View style={{ paddingTop: 20, paddingLeft: 30, paddingRight: 30 }}>
          <Button title="确认" onPress={ this.onConfirm.bind(this) }/>
        </View>
      </SafeAreaView>
    )
  }

  onOringalPasswordChange(oringalPassword) {

    this.setState({ oringalPassword })
  }

  onNewPasswordChange(newPassword) {

    this.setState({ newPassword })
  }

  onConfirmPasswordChange(confirmPassword) {

    this.setState({ confirmPassword })
  }

  onConfirm() {

  }
 }

 
const styles = StyleSheet.create({
  inputRow: {
    paddingTop: 5,
    paddingBottom: 10,
    paddingLeft: 30,
    paddingRight: 30
  }, 
  inputText: {
    marginTop: 0,
    height: 40,
    borderBottomWidth: 1,
    borderBottomColor: "#666",
  }
})

export default PasswordModify